<template>
	<view class="container">
		<nav-bar title="运营公告" :showBack="true"></nav-bar>
		<view class="notices" v-if="noticeList && noticeList.length > 0">
			<view class="notice" v-for="(notice, index) in noticeList">
				<text class="title">{{ notice.title }}</text>
				<rich-text class="content" :nodes="notice.content"></rich-text>
				<text class="createTime">发布时间：{{ notice.createTime }}</text>
			</view>
		</view>
	</view>
</template>

<script>
	import {
		getNoticeList
	} from '@/api/metro.js'
	export default {
		data() {
			return {
				noticeList: null
			}
		},
		onLoad() {
			this.getNoticeList();
		},
		methods: {
			// 获取公告列表
			getNoticeList() {
				const _that = this;
				getNoticeList()
					.then((res) => {
						_that.noticeList = res.rows;
					});
			}
		}
	}
</script>

<style lang="scss">
	.container {
		.notices {
			.notice {
				width: 100%;
				padding: 0.8rem 3%;
				overflow: hidden;
				box-sizing: border-box;
				background-color: $uni-bg-color;
				
				.title {
					font-size: 1.2rem;
					line-height: 3rem;
				}
				
				.content {
					
				}
				
				.createTime {
					font-size: 0.8rem;
					color: $uni-text-color-grey;
					text-align: right;
					line-height: 3rem;
					display: block;
				}
			}
		}
	}
</style>
